<template>
	<view class="recommend bg-color">
		<view class="recommend-item">
			<image class="item-big" src="../../static/img/3.webp" mode=""></image>
			<view class="item-samll">
				<image class="item-img" src="../../static/img/5.webp" mode=""></image>
				<image class="item-img" src="../../static/img/5.webp" mode=""></image>
				<image class="item-img" src="../../static/img/5.webp" mode=""></image>
			</view>

		</view>
	</view>
</template>

<script>
</script>

<style scoped>
	.recommend {
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		border-radius: 20rpx;
		border: 2rpx solid #ccc;
		overflow: hidden;
		margin: 20rpx 0;

	}

	.item-big {
		width: 100%;
		height: 300rpx;
	}

	.item-samll {
		width: 100%;
		height: 240rpx;
	}

	.item-img {
		width: 33.3%;
		height: 240rpx;
	}
</style>
